<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS交互测试页面</title>
    <style>
        .div {
            float: left;
            width: 30%;
            height: 100px;
            border-style: solid;
            margin: 5%;
            text-align: center;
            line-height: 100px;
        }
    </style>
    <script type="text/javascript">
        // nativeMethodName : 调用的原生方法名称, String类型
        // parameters       : Web页面传递给原生的参数, object类型
        // htmlCallBack     : Web页面的回调方法名称, String类型
        function srsCallNative(nativeMethodName, parameters, htmlCallBack) {
            
            if (typeof parameters != 'object') {
                srsParametersTypeError(nativeMethodName, '参数格式错误');
                return;
            }
            
            if(navigator.userAgent.indexOf('Android') != -1) { // 安卓
                var parametersStr = JSON.stringify(parameters);
                if(typeof(window.metaObj.srsNativeMethod) == 'function') {
                    window.metaObj.srsNativeMethod(nativeMethodName, parametersStr, htmlCallBack,'srsCallback');
                }else{
                    srsNativeEntranceNotFound();
                }
            } else { //苹果
                var nativePara = {};
                if(parameters != null){
                    nativePara.parameters = parameters;
                }
                nativePara.webCallBack = htmlCallBack;
                nativePara.nativeMethod = nativeMethodName+':';
                if(navigator.userAgent.indexOf('UIWebView') != -1) {
                    if(typeof(__srsNative__) == 'object') {
                        __srsNative__.srsNativeEntrance(nativePara);
                    } else {
                        srsNativeEntranceNotFound();
                    }
                } else if(navigator.userAgent.indexOf('WKWebView') != -1) {
                    if (window.webkit.messageHandlers.__srsNative__) {
                        nativePara.nativeEntrance = 'srsNativeEntrance:';
                        window.webkit.messageHandlers.__srsNative__.postMessage(nativePara);
                    } else {
                        srsNativeEntranceNotFound();
                    }
                } else {
                    srsNativeEntranceNotFound();
                }
                
            }
        }


        // 判断原生方法是否实现
        // nativeMethodName : 调用的原生方法名称, String类型
        // nativeMethodExist : 方法是否存在的回调(方法名, 字符串), 该方法需要两个参数
        // nativeMethodExist(nativeMethodName,exist): 检查的方法名, 方法是否存在(true, false)
        function srsCheckNativeMethodExist(nativeMethodName, nativeMethodExist) {
            if(typeof nativeMethodExist !== 'string'){
                return;
            }
            if(navigator.userAgent.indexOf('Android') != -1) { // 安卓
                if(typeof(window.metaObj.srsCheckMethodExist) == 'function') {
                    window.metaObj.srsCheckMethodExist(nativeMethodName, nativeMethodExist);
                }else{
                    window[nativeMethodExist] && typeof window[nativeMethodExist] === 'function' && window[nativeMethodExist](nativeMethodName, 'false');
                }
            } else { //苹果
                var nativePara = {};
                nativePara.webCallBack = nativeMethodExist;
                nativePara.nativeMethod = nativeMethodName+':';
                if(navigator.userAgent.indexOf('UIWebView') != -1) {
                    if(typeof(__srsNative__) == 'object') {
                        __srsNative__.srsNativeCheckEntrance(nativePara);
                    } else {
                        window[nativeMethodExist] && typeof window[nativeMethodExist] === 'function' && window[nativeMethodExist](nativeMethodName, 'false');
                    }
                } else if(navigator.userAgent.indexOf('WKWebView') != -1) {
                    if (window.webkit.messageHandlers.__srsNative__) {
                        nativePara.nativeEntrance = 'srsNativeCheckEntrance:';
                        window.webkit.messageHandlers.__srsNative__.postMessage(nativePara);
                    } else {
                        window[nativeMethodExist] && typeof window[nativeMethodExist] === 'function' && window[nativeMethodExist](nativeMethodName, 'false');
                    }
                } else {
                    window[nativeMethodExist] && typeof window[nativeMethodExist] === 'function' && window[nativeMethodExist](nativeMethodName, 'false');
                }
            }
        }


        // 该方法被调用,说明不支持新JS调用方式,为老版本
        function srsNativeEntranceNotFound() {
            console.log('Native Entrance not Found');
        }


        // 该方法被调用,说明原生方法未找到
        function srsNativeMethodNotFound(nativeMethodName) {
            console.log(nativeMethodName + ' Method Not Found');
        }


        function srsParametersTypeError(nativeMethodName, errorInfo) {
            console.log('Method of '+ nativeMethodName + ' parameters type error,' + errorInfo);
        }



        function srsCallback(htmlCallBack,result){
            if(typeof(eval(htmlCallBack)) == 'function'){
                var params = JSON.parse(result);
                eval(htmlCallBack+'(params);');
            }
        }

        
        
        </script>
</head>
<body>
<div>
    <div class="div" onclick="JSNative1()">JSNative</div>
    <div class="div" onclick="JSCommon1()">JSCommon</div>
    
    <div class="div" onclick="JSNativeright1()">JSNativeright1</div>
    <div class="div" onclick="JSNativeright2()">JSNativeright2</div>
    <div class="div" onclick="JSNativeright3()">JSNativeright3</div>

    
    <div class="div" onclick="JSGobackPage1()">JSGobackPage</div>
    
    <div class="div" onclick="JSTitleInfo1()">JSTitleInfo-1</div>
    <div class="div" onclick="JSTitleInfo2()">JSTitleInfo-2</div>
    <div class="div" onclick="JSTitleInfo3()">JSTitleInfo-3</div>

    <div class="div" onclick="JSBackInfo0()">JSBackInfo-0</div>
    <div class="div" onclick="JSBackInfo1()">JSBackInfo-1</div>

    <div class="div" onclick="JSCloseInfo0()">JSCloseInfo-0</div>
    <div class="div" onclick="JSCloseInfo1()">JSCloseInfo-1</div>

    <div class="div" onclick="JSGoindex1()">JSGoindex</div>
    
</div>
</body>
<script>

    function JSNative1() {
        var content = {
                'pageId' : 'A6',
                'orderAmount' : '2000',
                'redPacket' : '5',
                'score' : '2000',
                       'discount' : '5'
        };
        srsCallNative('JSOpenShareServiceDialog', content, null);
    }

function  JSCommon1() {
    var content = {
        'title' : '去哪1',
        'action' : 'goto',
        'detailUrl' : '"https://paymenttest.bankcomm.com/mdq/bonus/details.html?id=205',
        'imgUrl' : 'http://creditcard.bankcomm.com/content/dam/phone/images/pics/icon-120.png'
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSCommon', parameters, null);

}

function JSNativeright1() {
    var content = [
                {
                   'title' : '主页111',
                   'action' : 'goHome'
                   },
                   {
                   'title' : '主页222',
                   'action' : 'autoRepayBack'
                   }
    ];
    var parameters = {
        'content':content
    };
    srsCallNative('JSNativeright', parameters, null);
    
}

function JSNativeright2() {
    var content = [
                {
                   'title' : '主页111',
                   'action' : 'goHome'
                   },
                   {
                   'title' : '主页222',
                   'action' : 'autoRepayClose'
                   }
    ];
    var parameters = {
        'content':content
    };
    srsCallNative('JSNativeright', parameters, null);
    
}


function JSNativeright3() {
    var content = [
                {
                   'title' : '主页111',
                   'action' : 'goHome'
                   },
                   {
                   'title' : '主页222',
                   'action' : 'autoRepayClose2'
                   }
    ];
    var parameters = {
        'content':content
    };
    srsCallNative('JSNativeright', parameters, null);
    
}


function JSGobackPage1() {

    var parameters = {
        'content':'https://paymenttest.bankcomm.com/mdq/bonus/details.html?id=205'
    };
    srsCallNative('JSGobackPage', parameters, null);
    
}

function JSTitleInfo1() {
    var content = {
        'type' : '1',
        'title' : '文本标题',
        'imgUrl' : 'http://creditcard.bankcomm.com/content/dam/phone/images/pics/icon-120.png'
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSTitleInfo', parameters, null);
    
}

function JSTitleInfo2() {
    var content = {
        'type' : '2',
        'title' : '文本标题',
        'imgUrl' : 'http://creditcard.bankcomm.com/content/dam/phone/images/pics/icon-120.png'
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSTitleInfo', parameters, null);
    
}

function JSTitleInfo3() {
    var content = {
        'type' : '3',
        'title' : '文本标题',
        'imgUrl' : 'http://creditcard.bankcomm.com/content/dam/phone/images/pics/icon-120.png'
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSTitleInfo', parameters, null);
    
}

function JSBackInfo0() {
    var content = {
        'type' : '0',
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSBackInfo', parameters, null);
    
}

function JSBackInfo1() {
    var content = {
        'type' : '1',
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSBackInfo', parameters, null);
    
}

function JSCloseInfo0() {
    var content = {
        'type' : '0',
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSCloseInfo', parameters, null);
    
}

function JSCloseInfo1() {
    var content = {
        'type' : '1',
    };
    var parameters = {
        'content':content
    };
    srsCallNative('JSCloseInfo', parameters, null);
    
}




function JSGoindex1() {

    var parameters = {
        'content':'awrad'
    };
    srsCallNative('JSGoindex', parameters, null);
    
}
</script>
</html>
